<!--
Date: 2025-08-13
Copyright (c) 2025 CAX Conversion Project
-->
<template>
  <div>
    <el-input ref="inputRef" v-model="trackValue" style="width: 260px" @focus="handleDialogOpen"></el-input>
    <el-dialog v-model="dialogVisible" title="选择批次号" width="800px" append-to-body>
      <base-table
        v-loading="tableLoading"
        :table-headers="tableHeaders"
        :table-data="tableData"
        :table-props="tableProps"
        :table-events="tableEvents"
      >
      </base-table>
      <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" :total="total" @pagination="initData" />
      <template #footer>
        <div class="dialog-footer">
          <el-button :loading="buttonLoading" type="primary" @click="handleSure">确 定</el-button>
          <el-button @click="handleCancel">取 消</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">
import { getTrackList } from '@/api/bomCompareTool/standardInstallationList/index';
// 获取当前实例
const { proxy } = getCurrentInstance();
const props = defineProps({
  modelValue: String,
  aircraftModel: String,
  bomDetailType: String
});
const emit = defineEmits(['update:modelValue', 'init-data']);
const dialogVisible = ref(false);
const tableLoading = ref(false);
const buttonLoading = ref(false);
const trackValue = ref(props.modelValue);
const inputRef = ref<ElInputInstance>();
const total = ref(0);
const multipleSelection = ref([]);
const tableData = ref([]);

const queryParams = ref({
  pageNum: 1,
  pageSize: 10,
  bomDetailType: props.bomDetailType
});
// 表格配置
const tableHeaders = [
  {
    columnProps: {
      type: 'selection',
      width: '55'
    }
  },
  {
    columnProps: { prop: 'track', label: '批次号' }
  },
  {
    columnProps: { prop: 'desc', label: '描述' }
  }
];
const tableProps = {
  style: {
    width: '100%'
  }
};
const handleSelectionChange = (val) => {
  multipleSelection.value = val;
};
const tableEvents = {
  'selection-change': handleSelectionChange
};
const handleDialogOpen = () => {
  initData();
  inputRef.value.blur();
  dialogVisible.value = true;
};
const initData = async () => {
  tableLoading.value = true;
  const res = await getTrackList(props.aircraftModel, queryParams.value);
  tableData.value = res.rows;
  total.value = res.total;
  tableLoading.value = false;
};
const handleSure = () => {
  if (multipleSelection.value.length !== 1) {
    proxy?.$modal.msgWarning('选择一条数据！');
    return false;
  }
  const obj = multipleSelection.value[0];
  // eslint-disable-next-line vue/no-mutating-props
  trackValue.value = obj.track;
  emit('update:modelValue', obj.track);
  dialogVisible.value = false;
};
const handleCancel = () => {
  dialogVisible.value = false;
};

onMounted(() => {
  initData().then(() => {
    const obj = tableData.value[0];
    // eslint-disable-next-line vue/no-mutating-props
    trackValue.value = obj.track;
    emit('update:modelValue', obj.track);
    emit('init-data');
  });
});
</script>

<style lang="scss" scoped></style>
